<template>
  <div class="mall-index">
    <el-tabs v-model="activeName" @tab-click.stop="">
      <el-tab-pane label="商品列表" name="good-list"><Goods /></el-tab-pane>
      <el-tab-pane label="编辑商品" name="good-editor"
        ><EditGoods
      /></el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { defineComponent, ref } from 'vue'
import { ElTabPane, ElTabs } from 'element-plus'
import Goods from './Goods.vue'
import EditGoods from './EditGoods.vue'
export default defineComponent({
  components: {
    ElTabPane,
    ElTabs,
    Goods,
    EditGoods,
  },
  setup() {
    // 活跃标签
    const activeName = ref('good-editor')
    return { activeName }
  },
})
</script>

<style lang="scss">
@import '../../../assets/styles/_var.scss';
.mall-index {
  height: 100%;
  padding: $pad-1;
  overflow: auto;
}
</style>
